﻿<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="Default.ascx.cs" Inherits="Framework.Portal.Layouts.Admin.Popups.FileManager.Default" %>
<%@ Import Namespace="Framework.Library.Core.Config" %>
<script type="text/javascript">
        
    //<![CDATA[
    var swfu;
    var foldercmenu;
    var filecmenu;
    var imagecmenu;
    var cmenu;

    $(document).ready(function () {

        // Prevent text selections
        divFiles = document.getElementById('files');
        divFiles.onselectstart = function () { return false; } // ie
        divFiles.onmousedown = function () { return false; } // mozilla

        // *** Context Menu ***//
        $.contextMenu.theme = 'mb';
        $.contextMenu.shadowOpacity = .3;

        // activate folder/file selection before show
        $.contextMenu.beforeShow = function () {
            // Hide all other contextmenus
            $('table.contextmenu, div.context-menu-shadow').css({ 'display': 'none' });

            // Enable paste button if clipboard has items
            if ($.MediaBrowser.clipboard.length > 0) {
                $('table.contextmenu div.context-menu-item').removeClass('context-menu-item-disabled');
            } else {
                // Disable paste button if no items are added to the clipboard
                $('table.contextmenu div.context-menu-item[title=paste]').addClass('context-menu-item-disabled');
            }

            // Show selection of file, folder or image
            if ($(this.target).hasClass('folder')) { //Folder
                $.MediaBrowser.selectFileOrFolder(this.target, $(this.target).attr('href'), 'folder', 'cmenu');
            } else if ($(this.target).hasClass('file')) { //File
                $.MediaBrowser.selectFileOrFolder(this.target, $(this.target).attr('href'), 'file', 'cmenu');
            } else if ($(this.target).hasClass('image')) { //Image
                $.MediaBrowser.selectFileOrFolder(this.target, $(this.target).attr('href'), 'image', 'cmenu');
            }

            return true;
        }
        //Context menus
        foldercmenu = [
        { 'Open': {
            onclick: function (menuItem, menu) { $.MediaBrowser.loadFolder($(this).attr('href')); },
            icon: '/Resource/Images/filemanager/contextmenu/open.png'
        }
        }
		, $.contextMenu.separator
		, { 'Copy': {
		    onclick: function (menuItem, menu) { $.MediaBrowser.copy(); },
		    icon: '/Resource/Images/filemanager/contextmenu/copy.gif'
		}
		}
		, { 'Cut': {
		    onclick: function (menuItem, menu) { $.MediaBrowser.cut(); },
		    icon: '/Resource/Images/filemanager/contextmenu/cut.gif'
		}
		}
		, { 'Paste': {
		    onclick: function (menuItem, menu) { $.MediaBrowser.paste(<%= Configurations.PORTALID %>); },
		    icon: '/Resource/Images/filemanager/contextmenu/paste.gif',
		    disabled: true
		}
		}
		, $.contextMenu.separator,
        { 'Rename': {
            onclick: function (menuItem, menu) { $.MediaBrowser.rename($(this).attr('href'), 'folder', <%= Configurations.PORTALID %>); },
            icon: '/Resource/Images/filemanager/contextmenu/rename.png'
        }
        }
		, $.contextMenu.separator,
		{ 'Delete': {
		    onclick: function (menuItem, menu) {
		        if (confirm('Do you really want to delete this folder and its contents?')) {
		            $.MediaBrowser.delete_all(<%= Configurations.PORTALID %>);
		        }
		    },
		    icon: '/Resource/Images/filemanager/contextmenu/delete.gif',
		    disabled: false
		}
		}
	];

        filecmenu = [
        { 'Insert': {
            onclick: function (menuItem, menu) { $.MediaBrowser.insertFile(); },
            icon: '/Resource/Images/filemanager/contextmenu/insert.png'
        }
        }
		, $.contextMenu.separator
		, { 'Copy': {
		    onclick: function (menuItem, menu) { $.MediaBrowser.copy(); },
		    icon: '/Resource/Images/filemanager/contextmenu/copy.gif'
		}
		}
		, { 'Cut': {
		    onclick: function (menuItem, menu) { $.MediaBrowser.cut(); },
		    icon: '/Resource/Images/filemanager/contextmenu/cut.gif'
		}
		}
		, { 'Paste': {
		    onclick: function (menuItem, menu) { $.MediaBrowser.paste(<%= Configurations.PORTALID %>); },
		    icon: '/Resource/Images/filemanager/contextmenu/paste.gif',
		    disabled: true
		}
		}
        , $.contextMenu.separator,
        { 'Rename': {
            onclick: function (menuItem, menu) { $.MediaBrowser.rename($(this).attr('href'), 'file', <%= Configurations.PORTALID %>); },
            icon: '/Resource/Images/filemanager/contextmenu/rename.png'
        }
        }
		, $.contextMenu.separator,
        { 'Delete': {
            onclick: function (menuItem, menu) {
                if (confirm('Do you really want to delete this file?')) {
                    $.MediaBrowser.delete_all(<%= Configurations.PORTALID %>);
                }
            },
            icon: '/Resource/Images/filemanager/contextmenu/delete.gif',
            disabled: false
        }
        }
	];

        imagecmenu = [
        { 'Insert': {
            onclick: function (menuItem, menu) { $.MediaBrowser.insertFile(); },
            icon: '/Resource/Images/filemanager/contextmenu/insert.png'
        }
        }
		, $.contextMenu.separator
		, { 'Copy': {
		    onclick: function (menuItem, menu) { $.MediaBrowser.copy(); },
		    icon: '/Resource/Images/filemanager/contextmenu/copy.gif'
		}
		}
		, { 'Cut': {
		    onclick: function (menuItem, menu) { $.MediaBrowser.cut(); },
		    icon: '/Resource/Images/filemanager/contextmenu/cut.gif'
		}
		}
		, { 'Paste': {
		    onclick: function (menuItem, menu) { $.MediaBrowser.paste(<%= Configurations.PORTALID %>); },
		    icon: '/Resource/Images/filemanager/contextmenu/paste.gif',
		    disabled: true
		}
		}
		, $.contextMenu.separator,
        { 'Rename': {
            onclick: function (menuItem, menu) { $.MediaBrowser.rename($(this).attr('href'), 'file', <%= Configurations.PORTALID %>); },
            icon: '/Resource/Images/filemanager/contextmenu/rename.png'
        }
        }
						, $.contextMenu.separator,
        { 'Delete': {
            onclick: function (menuItem, menu) {
                if (confirm('Do you really want to delete this image?')) {
                    $.MediaBrowser.delete_all(<%= Configurations.PORTALID %>);
                }
            },
            icon: '/Resource/Images/filemanager/contextmenu/delete.gif',
            disabled: false
        }
        }
	];

        cmenu = [
        { 'Large images': {
            onclick: function (menuItem, menu) { $.MediaBrowser.changeview('large_images'); },
            icon: '/Resource/Images/filemanager/contextmenu/view_images_large.png'
        }
        },
        { 'Small images': {
            onclick: function (menuItem, menu) { $.MediaBrowser.changeview('small_images'); },
            icon: '/Resource/Images/filemanager/contextmenu/view_images_small.png'
        }
        },
        { 'List': {
            onclick: function (menuItem, menu) { $.MediaBrowser.changeview('list'); },
            icon: '/Resource/Images/filemanager/contextmenu/view_list.png'
        }
        },
        { 'Details': {
            onclick: function (menuItem, menu) { $.MediaBrowser.changeview('details'); },
            icon: '/Resource/Images/filemanager/contextmenu/view_details.png'
        }
        },
        { 'Tiles': {
            onclick: function (menuItem, menu) { $.MediaBrowser.changeview('tiles'); },
            icon: '/Resource/Images/filemanager/contextmenu/view_tiles.png'
        }
        },
        { 'Content': {
            onclick: function (menuItem, menu) { $.MediaBrowser.changeview('content'); },
            icon: '/Resource/Images/filemanager/contextmenu/view_content.png'
        }
        }
		        , $.contextMenu.separator,
        { 'New folder': {
            onclick: function (menuItem, menu) { $.MediaBrowser.showLayer('newfolder'); },
            icon: '/Resource/Images/filemanager/contextmenu/open.png'
        }
        }
				        , $.contextMenu.separator,
        { 'Paste': {
            onclick: function (menuItem, menu) { $.MediaBrowser.paste(<%= Configurations.PORTALID %>); },
            icon: '/Resource/Images/filemanager/contextmenu/paste.gif',
            disabled: true
        }
        }
	];
        // *** Media Browser ***//
        $.MediaBrowser.init();
        // Add context menu to the files, folders and images
        $.MediaBrowser.contextmenu();

        var settings = {
            flash_url: "Resource/Javascript/filemanager/swfupload/swfupload.swf",
            upload_url: "/Resources.ashx?module=popup&action=do_upload",
            post_params: {
                "PHPSESSID": "<%=Session.SessionID %>",
                "uploadpath": "<%= uploadPath %>"
            },
            file_size_limit: "50 MB",
            file_types: "<%= extension_whitelist %>",
            file_types_description: "Media Files",
            file_upload_limit: 1,
            file_queue_limit: 0,
            custom_settings: {
                progressTarget: "fsUploadProgress",
                cancelButtonId: "btnCancel"
            },
            debug: false,

            // Button settings
            button_width: "175",
            button_height: "20",
            button_window_mode: "transparent",
            button_placeholder_id: "spanButtonPlaceHolder",
            button_text: '<span class="browseButton">Browse...</span>',
            button_text_style: ".browseButton {font-family:sans-serif; color:#000000; font-size:14px; font-weight: bold;}",
            button_cursor: SWFUpload.CURSOR.HAND,
            button_text_top_padding: 1,

            // The event handler functions are defined in handlers.js
            swfupload_loaded_handler: swfUploadLoaded,
            file_queued_handler: fileQueued,
            file_queue_error_handler: fileQueueError,
            file_dialog_complete_handler: fileDialogComplete,
            upload_start_handler: uploadStart,
            upload_progress_handler: uploadProgress,
            upload_error_handler: uploadError,
            upload_success_handler: uploadSuccess,
            upload_complete_handler: uploadComplete,
            queue_complete_handler: queueComplete, // Queue plugin event

            // SWFObject settings
            minimum_flash_version: "9.0.28",
            swfupload_pre_load_handler: swfUploadPreLoad,
            swfupload_load_failed_handler: swfUploadLoadFailed
        };
        swfu = new SWFUpload(settings);
    });	
//]]>
</script>
<input type="hidden" id="currentfolder" value="<%= uploadPath %>" />
<input type="hidden" id="currentview" value="<%= viewLayout %>" />
<!--+++++++++++++++++++++++++++++++++-->
<!--+     Address Bar & Search      +-->
<!--+++++++++++++++++++++++++++++++++-->
<div id="addressbar" class="ab">
    <ol>
        <li class="root"><span>&nbsp;</span></li>
        <li><a href="<%= uploadPath %>" title="<%= uploadPath.Trim('/') %>"><span>
            <%= rootName %></span></a></li>
    </ol>
    <div id="searchbar">
        <div class="cap">
        </div>
        <input name="search" id="search" value="Search" />
        <div class="button">
        </div>
    </div>
</div>
<!--+++++++++++++++++++++++++++++++++-->
<!--+           Menu Bar            +-->
<!--+++++++++++++++++++++++++++++++++-->
<div id="navbar" class="nb">
    <ul class="left">
        <li><a href="#" onclick="return $.MediaBrowser.showLayer('newfolder');" title="New folder">
            <span>New folder</span></a></li>
        <li><a href="#" onclick="return $.MediaBrowser.showLayer('upload');" title="Upload>">
            <span>Upload</span></a></li>
        <li class="label"><a href="#" onclick="return $.MediaBrowser.printClipboard();" title="Clipboard">
            <span>Clipboard&nbsp;(&nbsp;<div id="cbItems">
                0</div>
                &nbsp;items&nbsp;)</span></a></li>
    </ul>
    <ul class="right">
        <li><a href="#" title="Change view"><span>View</span></a>
            <ul>
                <li><a href="#" onclick="return $.MediaBrowser.changeview('large_images');" title="Large images">
                    <span class="icon large"></span>Large images</a></li>
                <li><a href="#" onclick="return $.MediaBrowser.changeview('small_images');" title="Small images">
                    <span class="icon small"></span>Small images</a></li>
                <li><a href="#" onclick="return $.MediaBrowser.changeview('list');" title="List"><span
                    class="icon list"></span>List</a></li>
                <li><a href="#" onclick="return $.MediaBrowser.changeview('details');" title="Details">
                    <span class="icon details"></span>Details</a></li>
                <li><a href="#" onclick="return $.MediaBrowser.changeview('tiles');" title="Tiles"><span
                    class="icon tiles"></span>Tiles</a></li>
                <li><a href="#" onclick="return $.MediaBrowser.changeview('content');" title="Content">
                    <span class="icon content"></span>Content</a></li>
            </ul>
        </li>
        <li><a href="#" onclick="return $.MediaBrowser.showLayer('help');" class="help" title="Help">
            <span>
                <img src="/Resource/Images/filemanager/help.png" alt="Help" /></span></a></li>
    </ul>
</div>
<div id="message">
</div>
<div id="explorer">
    <div id="tree">
        <ul class="treeview">
            <li class="selected"><a class="root" href="<%= uploadPath %>"><%= rootName %></a>
            <asp:Literal ID="lblTreeview" runat="server"></asp:Literal>
            </li>
        </ul>
    </div>
    <div id="vertical-resize-handler" class="resize-grip">
    </div>
    <div id="main">
        <!--
        +++++++++++++++++++++++++++++++++
        +        Files & Folders        +
        +++++++++++++++++++++++++++++++++
        -->
        <div id="filelist" class="layer">
            <h2>
                <%= rootName %></h2>
            <select id="filters">
                <asp:Literal ID="lblFilters" runat="server"></asp:Literal>
            </select>
            <hr />
            <div id="files">
                abcdef
            </div>
        </div>
        <!--
        +++++++++++++++++++++++++++++++++
        +      Create a new folder      +
        +++++++++++++++++++++++++++++++++
        -->
        <div id="newfolder" class="layer">
            <h2>
                Add a new folder</h2>
            <a href="#" class="close" onclick="$.MediaBrowser.hideLayer(); $.MediaBrowser.loadFolder($.MediaBrowser.currentFolder); return false;">
                X</a>
            <hr />
            <div class="window">
                <%--<form id="newfolderform" name="newfolderform" onsubmit="$.MediaBrowser.newFolder(); return false;">--%>
                <div class="padding10">
                    <div class="height20">
                        <label for="folderpath">
                            New folder is created in:
                            <input class="path" type="text" name="folderpath" id="folderpath" readonly="readonly" /></label>
                    </div>
                    <div class="paddingtop10 height20 marginbottom5">
                        <label for="newfoldername">
                            Name of the new folder:
                            <input class="path border" type="text" name="foldername" id="foldername" /></label>
                    </div>
                    <div class="paddingtop10 height20 marginbottom5">
                        <button type="button" onclick="$.MediaBrowser.newFolder(<%= Configurations.PORTALID %>); return false;" >
                            Create folder</button>
                        <button type="button" onclick="$.MediaBrowser.hideLayer(); $.MediaBrowser.loadFolder($.MediaBrowser.currentFolder); return false;">
                            Close</button>
                    </div>
                </div>
                <%--</form>--%>
            </div>
        </div>
        <!--
        +++++++++++++++++++++++++++++++++
        +      Upload a new file        +
        +++++++++++++++++++++++++++++++++
        -->
        <div id="upload" class="layer">
            <h2>
                Upload a new file</h2>
            <a href="#" class="close" onclick="$.MediaBrowser.hideLayer(); $.MediaBrowser.loadFolder($.MediaBrowser.currentFolder); return false;">
                X</a>
            <hr />
            <div class="window">
                <form id="form1" method="post" enctype="multipart/form-data">
                <div class="paddingtop10 paddingleft10 height20">
                    <label for="uploadpath">
                        Currently uploading in folder:
                        <input class="path" type="text" name="uploadpath" id="uploadpath" readonly="readonly" /></label>
                </div>
                <div class="paddingtop10 paddingleft10 height20">
                    Select your file: &nbsp;&nbsp;<span id="spanButtonPlaceHolder"></span>
                </div>
                <div class="padding10 height20">
                    Upload limited to 50 MB!</div>
                <div class="fieldset flash" id="fsUploadProgress">
                    <span class="legend">Upload queue</span>
                </div>
                <div class="paddingleft10">
                    <button id="btnCancel" type="button">
                        Cancel all uploads</button>
                    <button type="button" onclick="$.MediaBrowser.hideLayer(); $.MediaBrowser.loadFolder($.MediaBrowser.currentFolder); return false;">
                        Close</button>
                </div>
                <div id="divLoadingContent" class="content" style="background-color: #FFFF66; border-top: solid 4px #FF9966;
                    border-bottom: solid 4px #FF9966; margin: 10px 25px; padding: 10px 15px; display: none;">
                    SWFUpload is loading. Please wait a moment...
                </div>
                <div id="divLongLoading" class="content" style="background-color: #FFFF66; border-top: solid 4px #FF9966;
                    border-bottom: solid 4px #FF9966; margin: 10px 25px; padding: 10px 15px; display: none;">
                    SWFUpload is taking a long time to load or the load has failed. Please make sure
                    that the Flash Plugin is enabled and that a working version of the Adobe Flash Player
                    is installed.
                </div>
                <div id="divAlternateContent" class="content" style="background-color: #FFFF66; border-top: solid 4px #FF9966;
                    border-bottom: solid 4px #FF9966; margin: 10px 25px; padding: 10px 15px; display: none;">
                    We're sorry. SWFUpload could not load. You may need to install or upgrade Flash
                    Player. Visit the <a href="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash">
                        Adobe website</a> to get the Flash Player.
                </div>
                </form>
            </div>
        </div>
        <!--
        +++++++++++++++++++++++++++++++++
        +            Settings           +
        +++++++++++++++++++++++++++++++++
        -->
        <div id="settings" class="layer" style="display: none;">
            <h2>
                Settings</h2>
            <a href="#" class="close" onclick="$.MediaBrowser.hideLayer(); return false;" title="Close">
                Close</a>
            <hr />
            <div class="window">
                <div class="padding10">
                    <dl>
                        <dt>Language</dt>
                        <dd>
                            <select id="settings_language">
                                <option value="language">Language</option>
                            </select>
                        </dd>
                        <dt>Theme</dt>
                        <dd>
                            <select id="settings_skin">
                                <option value="skin">Skin</option>
                            </select>
                        </dd>
                    </dl>
                    <p>
                        Cookies need to be enabled to save your settings!</p>
                    <hr />
                    <button type="button" onclick="$.MediaBrowser.saveSettings(); return false;">
                        Save settings</button>
                    <button type="button" onclick="$.MediaBrowser.hideLayer(); return false;">
                        Close</button>
                </div>
            </div>
        </div>
        <!--
        +++++++++++++++++++++++++++++++++
        +              Help             +
        +++++++++++++++++++++++++++++++++
        -->
        <div id="help" class="layer" style="display: none;">
            <h2>
                NS File Browser v1.1</h2>
            <a href="#" class="close" onclick="$.MediaBrowser.hideLayer(); return false;" title="Close">
                Close</a>
            <hr />
            <div class="window">
                <div class="padding10">
                    <p>
                        Author: Nguyễn Quang Dũng<br />
                        Date: May 1, 2012<br />
                        <p>
                            Copyright (c) 2012 Nguyễn Quang Dũng</p>
                        <p>
                            Permission is hereby granted, free of charge, to any person obtaining a copy of
                            this software and associated documentation files (the "Software"), to deal in the
                            Software without restriction, including without limitation the rights to use, copy,
                            modify, merge, publish, distribute, sublicense, and/or sell copies of the Software,
                            and to permit persons to whom the Software is furnished to do so, subject to the
                            following conditions:</p>
                        <p>
                            The above copyright notice and this permission notice shall be included in all copies
                            or substantial portions of the Software.</p>
                        <p>
                            THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED,
                            INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR
                            PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS
                            BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT,
                            TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE
                            USE OR OTHER DEALINGS IN THE SOFTWARE.</p>
                        <p>
                            This plugin makes use of:</p>
                        <ul>
                            <li>jQuery (jquery.com)</li>
                            <li>jQuery.contextmenu - Matt Kruse (javascripttoolbox.com)</li>
                            <li>SWFUpload - (swfupload.org)</li>
                            <li>Javascript functions urlencode/urldecode - (phpjs.org)</li>
                            <li>createCookie - Peter-Paul Koch (http://www.quirksmode.org/js/cookies.html)</li>
                            <li>Javascript function printf - Dav Glass extension for the Yahoo UI Library</li>
                            <li>Modified version of Slimbox 2 - Christophe Beyls (http://www.digitalia.be)</li>
                        </ul>
                        <p>
                            <button type="button" onclick="$.MediaBrowser.hideLayer(); return false;">
                                Close</button></p>
                </div>
            </div>
        </div>
    </div>
</div>
<!--
+++++++++++++++++++++++++++++++++
+     File Information Pane     +
+++++++++++++++++++++++++++++++++
-->
<div id="file-specs">
    <div id="info">
    </div>
    <form id="fileform" name="fileform" onsubmit="$.MediaBrowser.insertFile(); return false;">
    <label for="file">
        File</label>
    <input type="text" name="file" id="file" readonly="readonly" value="" />
    <button type="submit">
        Insert</button>
    <div>
        <label for="absolute_url">
            <input class="checkbox" type="checkbox" id="absolute_url" />Absolute URL with hostname</label>
    </div>
    </form>
</div>
<script type="text/javascript">
    $(document).ready(function () {
        $('div#file-specs #info').load('/Resources.ashx?module=popup&action=view_spec', { 'ajax': true, 'path': urlencode("<%= uploadPath  %>"), 'type': 'folder' }, function () {
            $("div#file-specs a[rel^='lightbox']").slimbox({/* Put custom options here */
        }, null, function (el) {
            return (this == el) || ((this.rel.length > 8) && (this.rel == el.rel));
        });
        $('input#file').val("");
        $.MediaBrowser.loadFolder("<%= uploadPath %>");
    });

    if (!window.opener) {
        jQuery(document.body).append('<div id="darkbg"></div>');
        jQuery('#darkbg').show();
        jQuery('#darkbg').css('height', jQuery(document).height());
    }
});
</script>
